<template>
  <div class="datManage">
    <configCompositionTwoWindowStyle
      :leftWidth = "10"
      :rightWidth="14"
    >
      <template slot="card">
        <search
          :showAdvSearch="false"
          :showAdd="false"
          :inputTitle="$t('configLazyLoad.channel.dateTip1')"
          :loading="tableLoading"
          @search="searchList"
          @turnPage="turnPage"
          @refresh="refreshSearch"
          :currentPage="currentPage"
          :count="count"
          :reload="reload"
          :isReloadIvr="false"
          :pageSize='10'
        >
        </search>
        <scheduleManagementTable :tableData="tableData" :loading="tableLoading" @add="add"  @update="update" :titleName="titleName" :manageType="manageType" @delete="deleteManage" ref="scheduleTable"></scheduleManagementTable>
      </template>
      <template slot="detail" v-if="isShowAddOrEdit">
        <BreadCrumbConfig :titleArr="titleArr" @back="cancle"></BreadCrumbConfig>
        <div class="manage_box">
          <div class="remark" v-html="$t('configLazyLoad.channel.dateTip2')"></div>
          <updateManagement :manageType="manageType" :randomNum="randomNum" :updateInfo="updateInfo" :type="type" @back="cancle"></updateManagement>
        </div>

      </template>
    </configCompositionTwoWindowStyle>
  </div>
</template>
<script>
  import configCompositionTwoWindowStyle from '../../../../ui-modules/config/configCompositionTwoWindowStyle'
  import search from './search'
  import scheduleManagementTable from './webchatManageTable'
  import updateManagement from './editWebchatManage'
  import BreadCrumbConfig from '@/components/ui-modules/breadCrumb/BreadCrumbConfig'
  import * as types from '@modules/config/channelConfig/webchatSchdule/mutation-types.js'

  export default {
    name: 'webchatManage',
    data () {
      return {
        count: 0,
        totalPage: 1,
        reload: true,
        tableLoading: false,
        tableData: [],
        isShowAddOrEdit: false,
        titleArr: [this.$t('channelsettings.schedule2'), this.$t('channelsettings.schedule3')],
        isShowAdd: false,
        isShowEdit: false,
        searchContent: '',
        inputName: '',
        currentPage: 1,
        isSearch: false,
        randomNum: 1,
        type: 'add',
        titleName: this.$t('configLazyLoad.channel.webName')}
    },
    methods: {
//      刷新
      searchList (data) {
        this.inputName = data || ''
        this.currentPage = 1
        this.initTable(data)
      },
      refreshSearch () {
        this.inputName = ''
        this.refresh()
      },
      refresh (data) {
        this.searchContent = ''
        this.isShowAddOrEdit = false
        this.isShowAdd = false
        this.isShowEdit = false
        this.currentPage = 1
        this.initTable(null, data)
      },
//      初始化数据
      initTable (name, access) {
        this.tableLoading = true
        let data = {
          page: this.currentPage,
          platform: this.manageType,
          limit: 10,
          scheduleEnable: true
        }
        let dataTwo = {
          accessType: this.manageType
        }
        if (typeof name === 'string') {
          this.isSearch = true
          data.name = name
        }
        let action = 'queryWebchat'
        if (this.manageType === 'weibo') {
          action = 'queryWeiboList'
          data = {
            page: this.currentPage,
            limit: 10,
            scheduleEnable: true
          }
        } else if (this.manageType === 'wechat') {
          action = 'queryWeChatAuthorizationList'
          data = {
            scheduleEnable: true,
            hasWxDev: true,
            page: this.currentPage,
            limit: 10,
            name: name
          }
        } else if (this.manageType === 'wechatMini') {
          action = 'queryWxMiniConfigArr'
          data = { pageSize: 10, page: this.currentPage, name: name, scheduleEnable: true }
//          dataTwo.accessType = 'wxmini'
        }
        let that = this
        if (this.manageType === 'web') {
          data.name = this.inputName || name
        }
        let p1 = this.$store.dispatch(action, data)
        let p2 = this.$store.dispatch('getScheduleList', dataTwo)
        let p3 = this.$store.dispatch('getProcessList', {})
        let dispatchArr = [p1, p2, p3]
        if (that.manageType === 'wechatMini') {
          let queryData = {
            limit: 10,
            page: this.currentPage,
            name: name,
            scheduleEnable: true
          }
          let p4 = this.$store.dispatch('getWeixinMiniAuthConfigList', queryData)
          dispatchArr = [p1, p2, p3, p4]
        }
        Promise.all(dispatchArr).then(([rep1, rep2, rep3, rep4]) => {
          that.tableLoading = false
          if (rep1 && rep1.success) {
            that.tableData = rep1.list
            that.totalPage = Math.ceil(rep1.count / 10)
            that.count = rep1.count
            if (that.manageType === 'wechatMini' && rep4 && rep4.success) {
              let dataNew = rep4.list
              dataNew.forEach((item) => {
                item.name = item.nick_name
              })
              that.count = rep1.count + rep4.count
              that.tableData = rep1.list.concat(dataNew)
              that.totalPage = Math.ceil(that.count / 10)
            }
            if (rep2 && rep2.success) {
              that.tableData.forEach((item) => {
                let manageList = []
                for (let i = 0; i < rep2.data.length; i++) {
                  if (this.manageType === 'wechat' || this.manageType === 'wechatMini' || this.manageType === 'weibo') {
                    if (item._id === rep2.data[i].accessId) {
                      manageList.push(rep2.data[i])
                    }
                  } else {
                    if (item.accessId === rep2.data[i].accessId) {
                      manageList.push(rep2.data[i])
                    }
                  }
                }
                that.$set(item, 'manageList', manageList)
              })
              if (access) {
                this.$nextTick(() => {
                  this.$refs.scheduleTable.rowClick({accessId: access})
                })
              }
            }
          }
          if (rep3 && rep3.success) {
            this.$store.commit(types.SET_ALL_WEBCHAT_SCHDULE_PROCESS_LIST, rep3.data)
          }
        })
      },
//      翻页
      turnPage (index, data) {
        this.currentPage = index
        this.cancle()
        this.initTable(data)
      },
//      添加日程
      add (data) {
        this.isShowAddOrEdit = true
        this.isShowAdd = true
        this.isShowEdit = false
        this.titleArr = [this.$t('channelsettings.schedule2'), this.$t('channelsettings.schedule3')]
        this.randomNum = Math.random()
        this.type = 'add'
        this.updateInfo = {
          account: data.account,
          name: '',
          accessId: this.manageType === 'wechat' || this.manageType === 'weibo' || this.manageType === 'wechatMini' ? data._id : data.accessId,
          accessType: this.manageType,
          order: '',
          startDate: '*',
          endDate: '*',
          startTime: '*',
          endTime: '*',
          weekMon: true,
          weekTue: true,
          weekWed: true,
          weekThu: true,
          weekFri: true,
          weekSat: true,
          weekSun: true,
          processId: '',
          createTime: '',
          createUser: '',
          updateTime: '',
          updateUser: ''
        }
      },
//      修改日程
      update (data) {
        this.isShowAddOrEdit = true
        this.isShowAdd = false
        this.isShowEdit = true
        this.titleArr = [this.$t('channelsettings.schedule2'), this.$t('channelsettings.schedule6')]
        this.randomNum = Math.random()
        this.type = 'edit'
        this.updateInfo = data
      },
//      删除
      deleteManage (data) {
        this.$confirm(this.$t('config.channel.deleteManageConfirm'), this.$t('public.tip'), {
          confirmButtonText: this.$t('public.confirm'),
          cancelButtonText: this.$t('public.cancel'),
          cancelButtonClass: 'primary_btn',
          confirmButtonClass: 'primary_btn',
          type: 'warning'
        }).then(() => {
          console.log(data)
          let dataNew = {
            _id: data._id
          }
          this.$store.dispatch('webchatDelSchedule', dataNew).then((res) => {
            if (res && res.success) {
              this.$message.success(this.$t('config.channel.deleteSuccess'))
              this.refresh()
            } else {
              this.$message.error(this.$t('config.channel.deleteFailure'))
            }
          })
        })
      },
//      取消
      cancle (data) {
        this.isShowAddOrEdit = false
        this.isShowAdd = false
        this.isShowEdit = false
        if (data) {
          this.refresh(data)
        }
      }
    },
    props: {
      manageType: {
        type: String,
        default: 'web'
      }
    },
    beforeMount () {
      if (this.manageType === 'weibo') {
        this.titleName = this.$t('config.channel.weiboName')
      } else if (this.manageType === 'wechat') {
        this.titleName = this.$t('configLazyLoad.channel.wechatName')
      } else if (this.manageType === 'sdk') {
        this.titleName = this.$t('configLazyLoad.channel.appName')
      } else if (this.manageType === 'wechatMini') {
        this.titleName = this.$t('configLazyLoad.channel.appletName')
      } else {
        this.titleName = this.$t('configLazyLoad.channel.webName')
      }
      this.initTable()
    },
    computed: {
    },
    components: {
      configCompositionTwoWindowStyle,
      search,
      scheduleManagementTable,
      BreadCrumbConfig,
      updateManagement
    }
  }
</script>
<style lang="stylus" scoped>
  .datManage
    overflow auto
  .remark
    color #3b5998
  .manage_box
    padding 20px
</style>
